<template>
    <div class="custinger">
        <h1>客服咨询
            <small>常规客服咨询</small>
        </h1>
        <div class="item" @click="toCustomer">
            <p>
                零售奖励问题
            </p>
        </div>
        <div class="item" @click="toCustomer">
            <p>
                账号身份及推广
            </p>
        </div>
        <div class="item" @click="toCustomer">
            <p>
                提现/积分问题
            </p>
        </div>
        <div class="item" @click="toCustomer2">
            <p>
                物流/发货/退换货
            </p>
        </div>
        <div class="nav-i">
            <img :src="urlImg" alt="">
            <div class="nav-r">
                <h4>关注公众号咨询,及时获取回复信息</h4>
                <p class="p2">由于客服繁忙，60秒以内未收到回复的家人，不要着急，关注爱润妍公众号咨询相关问题，随时随地及时获取回复信息。</p>
            </div>
        </div>
        <div class="nav-i">
            <img src="https://iryoss3-0.oss-cn-beijing.aliyuncs.com/static/poly-public.png" alt=""/>
            <div class="nav-r">
                <h4>关注公众号咨询物流/发货/退换货,及时获取回复信息</h4>
                <p class="p2">由于客服繁忙，60秒以内未收到回复的家人，不要着急，关注爱润妍公众号咨询相关问题，随时随地及时获取回复信息。</p>
            </div>
        </div>
    </div>
</template>
<div>
</div>
<script>
    export default {
        /**
         * 客服详情
         */
        name: "custinger",
        data() {
            return {
                urlImg: ''
            };
        },
        created() {
            this.urlImg = this.$route.query.urlImg;
        },
        methods: {
            toCustomer() {
                // 跳转客服
                window.location.href = `https://webchat.7moor.com/wapchat.html?accessId=95145560-4f70-11e9-bdb0-9354e1ad17a8`;
            },
            toCustomer2() {
                // 跳转客服
                window.location.href = `https://webchat.7moor.com/wapchat.html?accessId=c8ef25a0-75e4-11e9-ad7f-67758c4ccb47`;
            }
        },

    };
</script>

<style scoped lang="stylus" rel="stylesheet/stylus">
    @import '~assets/main.styl'
    .custinger {
        padding 0 3vw
        background grayF
        height 100vh
        box-sizing border-box
        flex-y(flex-start)
        .nav-i {
            flex-x()
            width 100%
            img {
                width vw(101)
                height vw(101)
            }
            .nav-r {
                padding-left 3vw
                width 64vw
                h4 {
                    line-height 1.4
                }
                p {
                    text-align justify
                }
            }
        }
        h1 {
            word-vw(36px, gray3)
            line-height 2
            small {
                word-vw(18px, gray9)
            }
        }
        .item {
            width vw(330)
            background gray5
            border 1px solid #ddd
            height vw(37)
            padding 0 2vw
            border-radius main-radius
            margin-bottom 2vw
            p {
                line-height vw(37)
            }
        }
    }
</style>